*{
            margin:0;
            padding:0;
            box-sizing: border-box; 
        }
        header{
            background-color: rgb(7, 176, 176);
            height: 120px;
            border: 2px solid black;
            border-radius:3px;
        }
        .school{
            font-family:Tahoma;
            font-size: 35px;
            font-weight: bolder;
            font-variant: normal;
            text-align:center;
            margin:0px;
            color:white; 
            text-decoration: none;
            text-shadow: 2px 2px 15px rgb(244, 136, 53);
        }
        .school1{
            font-family:Tahoma;
            font-size: 30px;
            font-weight: bold;
            font-variant: normal;
            margin-top: -5px;
            text-align:center;
            color:white; 
            text-decoration: none;
            text-shadow: 2px 2px 15px rgb(244, 136, 53);
        }
        .school::first-letter{
            font-size: 50px;
        }
        .school span{
            font-size:40px;
        }
        .logo {
            width:110px;
            height:120px;
            float:right;
            margin-top:-125px;
            margin-right:10px;
        }
        .navi_bar{
            width:100%;
            height:60px;
            position:absolute;
            margin-top:1px;
            border-radius:5px; 
            background:brown;   
        }
        .navi_bar ul{
            position:absolute;
            list-style-type: none;
            width:100%;
            border-radius: 8px;
            
        }
        .navi_bar ul li{
            display:inline-block;
            font-family: arial;
            font-size: 20px;
            padding:17px 50px 0px 0px;
            font-variant: small-caps;
            position:relative;
            left:500px;
            scroll-behavior:smooth;
        }
        .navi_button{
            position: relative;
            width:100px;
            height:35px;
            left:1380px;  
            border-radius:5px;
            background-color: black;
            color:white;
            font-family:Times New Roman;
            top: 13px;  
            font-size: 18px; 
            cursor:pointer; 
            padding: 5px; 
        }
        .navi_bar ul li a {
            text-decoration: none;
            display: block;
            text-align:center;
        }
        .navi_bar ul li a:hover{
            color:red;
            border-radius:5px;
        }
        .navi_bar .dropdown {
            list-style-type: none;
            display:none;
            z-index:999;
            position:absolute;
            width:100%;
            
        }
        .navi_bar .dropdown li{
            background-color: antiquewhite;
            width:150px;
            color:black;
            display:block;
            position:relative;
            font-size: 16px;
            left:0px;
            padding: 5px; 
            border-radius:5px;  
        }
        .navi_bar li:hover .dropdown{
            display:block;
            color:white;
        }
        .slider {
        margin:0;
        padding:0;
        position:relative;
        box-sizing: border-box; 
        }
        .list {
        position:relative;
        margin:65px 30px 0px 30px;
        }
        .myslides{
        display:none;
        animation: fade 1.5s;
        }
        .myslides img{
        border-radius:20px;
        height:550px;
        }
        @keyframes fade{
            from {opacity:.4}
            to {opacity:1}
        }
        .prev,
        .next {
        cursor: pointer;
        position: absolute;
        top: 40%;
        width: auto;
        padding: 16px;
        margin-top: 20px;
        color: white;
        font-weight: bold;
        font-size: 20px;
        border-radius: 0 3px 3px 0;
        user-select: none;
        -webkit-user-select: none;
        }
        /* Position the "next button" to the right */
        .next {
        right: 0;
        border-radius: 3px 0 0 3px;
        }
        /*position the next div bar for the motto animation*/
        .motto_container{
            width:100%;
            height: 450px;
            margin-top:20px;
            position:relative;
        }
        .motto_container1{
            width:700px;
            height: 400px;
            position:relative;
            background:url(success\ \(1\).jpg);
            background-position:center;
            background-size:cover;
            background-repeat: no-repeat;
            float:right;
            margin: 20px 30px 0px 0px;
            border-radius:20px;
            box-shadow:2px 2px 35px gold;
            
        }
        .motto_container1 .motto1{
            position:relative;
            width:200px;
            height:100px;
            margin-left: 50px;
            margin-top: 190px;

        }
        .motto1 img{
            width: 180px;
            height: 100px;
            position:absolute;
            z-index: 0;
            animation:blink 3s linear infinite;
        }
        @keyframes blink {
            0%, 100% {opacity: 1;}
            50% {opacity: 0;}
          }
        .motto_container1 .motto2{
            position:relative;
            width:200px;
            height:100px;
            margin-left: 250px;
            margin-top: -299px;
        }
        .motto2 img{
            width: 180px;
            height: 100px;
            position:absolute;
            z-index: 0;
            animation:blink 3s linear infinite;
        }
        @keyframes blink {
            0%, 100% {opacity: 1;}
            50% {opacity: 0;}
        }
        .motto_container1 .motto3{
            position:relative;
            width:200px;
            height:100px;
            margin-left: 480px;
            margin-top: 15px;
        }
        .motto3 img{
            width: 180px;
            height: 100px;
            position:absolute;
            z-index: 0;
            animation:blink 3s linear infinite;
        }
        @keyframes blink {
            0%, 100% {opacity: 1;}
            50% {opacity: 0;}
        }
      .HM_container{
        width:680px;
        height:400px;
        margin-top:20px;
        margin-left: 50px;
        position:absolute;
      }  
      .HM_container img{
        border-radius:100%; 
        width: 150px; 
        height: 150px;
        border:2px solid white; 
        margin-right:5px;
        margin-top:5px;
        box-shadow:0px 2px 18px #000; 
        position:relative;
        float:right;
      }
      .HM_container h3 {
        text-align:center; 
        font-size: 30px;
        margin-top:5px;
        margin-left: -10px; 
        font-family:calibri; 
        color: white;
        text-shadow: 0 0 5px black;
        line-height: 30px;
      }
      .HM_container p{
        margin-left:5px;
        text-align:center;
      }
      .about {
        font-size:20px;
        line-height: 35px;
        text-align: center;
        margin-top:15px;
      }
      .course{
        width:100%;
        height:500px;
        position: relative;
        margin-top:25px;
        display:flex;
      }
      .Ta_medium{
        position:relative;
        border:2px solid green;
        width: 700px;
        height:450px;
        margin-top:25px;
        margin-left: 20px;
        box-shadow: 5px 0px 25px black;
        overflow:hidden;
        border-radius: 20px;
      }
      .Ta_medium h3{
        text-align:center;
        text-shadow:2px 2px 20px pink;
        font-family:'Times New Roman', Times, serif;
        font-size: 25px;
        Position:sticky;
        margin-top:10px;
      }
      .Ta_medium ul{
        list-style-type:disc;
        display:inline-block;
        margin-left:20px;
      }
      .Ta_medium li{
        line-height:35px; 
      }
      .En_medium{
        position:absolute;
        border:2px solid green;
        width: 700px;
        height:450px;
        margin-top:25px;
        margin-left: 780px;
        box-shadow: 3px 0px 25px black;
        overflow:hidden;
        border-radius: 20px;
      }
      .En_medium h3{
        text-align:center;
        text-shadow:2px 2px 20px pink;
        font-family:'Times New Roman', Times, serif;
        font-size: 25px;
        margin-top:10px;
      }
      .En_medium ul{
        list-style-type:disc;
        display:inline-block;
        margin-left:20px;
      }
      .En_medium li{
        line-height:35px; 
      }
      .Recent {
        margin:auto;
        margin-top:10px;
        width: 200px;
        font-size: 30px;
        font-weight: 400;
        font-family: Tahoma;
        text-shadow: 3px 3px 20px orange;
      }
      .news{ 
        width:100%;
        height:400px;
        position: absolute;
        margin-top:15px;
        display:flex;
      }
      .success{
        width:300px;
        height:350px;
        margin-top:0px;
        margin-left: 50px;
        margin-right: 10px;
        position:relative;
        border-radius: 20px;
        box-shadow: 3px 3px 20px rgb(66, 66, 61);
      }
      .success:hover{
        color:orange;
      }
      .success img{
        position:relative;
        width:280px;
        height:200px;
        border-radius: 20px;
        margin: 10px 0 0 10px;
      }
      .success h3{
        text-align:center;
        margin-top:18px;
      }
      .total{
        width:100%;
        height:250px;
        background-color:blueviolet;
        position:absolute;
        margin-top:425px;
        display:flex;
        border-radius:7px;
      }
      .students{
        width:350px;
        height:200px;
        position:relative;
        border:3px solid white;
        margin-top:20px;
        margin-left:20px;
        border-radius: 5px 8px 5px 8px;
        background-color:brown;
      }
      .students h2{
        text-align:center;
        margin-top:70px;
        color:white;
      }
      .events{
        margin:auto;
        margin-top:700px;
        width: 200px;
        font-size: 30px;
        font-weight: 400;
        font-family: Tahoma;
        text-shadow: 3px 3px 20px orange;
      }
      .scroller{
            height:200px;
            width:100%; 
            position:absolute;
            display:flex;
        }
        .images{ 
            width:300px;
            height:250px; 
            display:flex;
            position:relative;
            animation:scroll-horizontal 25s linear infinite;
            justify-content: space-around;
        }
        @keyframes scroll-horizontal{
            0% {
                left:0%;
            }
            100%{
                left:-100%;
            }
        } 
        .images img{
            width:300px;
            height:150px;
            margin-left:15px;
            border-radius:10px;
            margin-top:20px;
            border:2px solid black;
        }
        .contact-info{
          width:100%;
          height:300px;
          border:3px solid black;
          margin-top:200px;
          display:flex;
          background:grey;
        }
        .contact_Us{
          position:absolute;
          width:650px;
          height:250px;
          border:2px solid green;
          margin-left:60px;
          margin-top:25px;
          border-radius:5px;
          box-shadow:1px 1px 10px white;
        } 
        .name{
          text-align:center;
          top:3px;
          position:relative;
          color:white;
        }
        .contact_Us span{
          margin-top:0px;
          font-size:14px;
          line-height: 5px;
          color:white;
        }
        .contact_Us1{
          position:absolute;
          width:650px;
          height:250px;
          border:2px solid green;
          margin-left:800px;
          margin-top:25px;
          border-radius:5px;
          box-shadow:1px 1px 10px white;
        } 
        .contact_Us1 address{
          text-align:center;  
          color:white;
          font-size:18px;
        }





        .copyright{
          width:100%;
          height:50px;
          position:absolute;
          margin-top:10px;
          background:rgb(118, 12, 12);
        }
        .copy{
          text-align:center;
          color:white;
          margin-top:10px;
        }
        .copy a{
          text-decoration: none;
          color:yellow;
        }